<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Calendar" %>
<%@ page import="java.util.Date" %>
<%@ page import="java.util.GregorianCalendar" %>
<%--
  Created by IntelliJ IDEA.
  User: gaoliwei02
  Date: 17/6/25
  Time: 上午10:31
  To change this template use File | Settings | File Templates.
--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>online device</title>
</head>

<body>
<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        online device
        <small>page</small>
    </h1>
</section>

<!-- Main content -->
<section class="content">
    <div class="box">
        <%--<div class="box-header with-border"></div><!-- /.box-header -->--%>
        <div class="box-body">
            <div class="row">

                <div class="col-lg-2  col-xs-6">
                    <label class="deviceId_search" for="deviceId_search">device_id</label>
                    <input type="text" class="form-control" id="deviceId_search" name="deviceId_search"
                           placeholder="">
                </div>

                <div class="col-lg-2  col-xs-6">
                    <label class="online_status_search" for="online_status_search">online_status</label>
                    <select type="text" class="form-control" id="online_status_search" name="online_status_search"
                            placeholder="" onchange="search()">
                        <option>online</option>
                        <option>offline</option>
                        <option>all</option>
                    </select>
                </div>

                <div class="col-lg-2  col-xs-6">
                    <label class="battery_status_search" for="channalA_status_search">channalA</label>
                    <select type="text" class="form-control" id="channalA_status_search">
                        <option>all</option>
                        <option>close</option>
                        <option>open</option>
                    </select>
                </div>

                <div class="col-lg-2  col-xs-6">
                    <label class="battery_status_search" for="channalB_status_search">channalB</label>
                    <select type="text" class="form-control" id="channalB_status_search">
                        <option>all</option>
                        <option>close</option>
                        <option>open</option>
                    </select>
                </div>

                <div class="col-lg-2  col-xs-6">
                    <label class="m_version_search" for="m_version_search">control_msg</label>
                    <input type="text" class="form-control" id="m_version_search" name="m_version_search"
                           placeholder="">
                </div>

                <div class="col-lg-4 col-xs-12">
                    <label for="report_time_search">report_time</label>

                    <div class="input-group" id="report_time_search">
                        <%
                            Date today = new Date();
                            GregorianCalendar gregorianCalendar = new GregorianCalendar();
                            gregorianCalendar.setTime(today);
                            gregorianCalendar.add(Calendar.DAY_OF_MONTH, -10);
                            Date yesterday = gregorianCalendar.getTime();
                            String yesterdayString = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(yesterday);
                            String todayString = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(today);
                        %>
                        <%--默认统计昨天的数据--%>
                        <input type="text" id="dateStart" class="form-control" name="start"
                               value="<%=yesterdayString%>"/>
                        <span class="input-group-addon">to</span>
                        <input type="text" id="dateEnd" class="form-control" name="end" value="<%=todayString%>"/>
                    </div>
                </div>

            </div>
        </div>
    </div>


    <div class="container removeLeftSpace">
        <div class="removeLeftSpace row">
            <div class="col-xs-2 col-lg-1 removeLeftSpace">
                <button class="btn btn-primary margin" style="width: 100px; margin-left: 0" onclick="search()">
                    <i class="fa fa-search" style=" margin-right: 4px;"></i>check
                </button>
            </div>

            <div class="col-xs-3 col-lg-2">
                <button class="btn btn-primary margin" style="width: 100px; margin-left: 0" onclick="update()">
                    <i class="fa fa-search" style=" margin-right: 4px;"></i>update
                </button>
            </div>

        </div>
    </div>

    <table id="online_check_table"
           data-toggle="table"
           data-side-pagination="server"
           data-pagination="true"
    <%--data-search="true"--%>
           data-page-size="15"
           data-page-list="[15, 50, 100, 500]"
    <%--data-url="/static/json/data1.json"--%>
           data-url="/report/getlist.inner"
           data-row-style="rowStyle"
           data-click-to-select="true"
           data-field="state"
           data-method="post"
           data-striped="true"
           data-query-params="queryParams"
            >
        <thead>
        <tr>
            <th data-checkbox="true">check</th>
            <th data-field="deviceId">deviceId</th>
            <th data-field="imei">imei</th>
            <th data-field="mac">mac</th>
            <th data-field="poiid">poiid</th>
            <th data-field="onlineStatus">onlineStatus</th>
            <th data-field="reportTime">&emsp; &emsp; reportTime&emsp; &emsp; </th>
            <th data-field="registerTime">&emsp; &emsp; registerTime&emsp; &emsp; </th>
            <th data-field="otaTime">&emsp; &emsp; &emsp;otaTime&emsp;&emsp; &emsp; </th>
            <th data-field="orderCreateTimeA">&emsp; &emsp; orderCreateTimeA&emsp; &emsp; </th>
            <th data-field="orderCreateTimeB">&emsp; &emsp; orderCreateTimeB&emsp; &emsp; </th>

            <th data-field="orderDurationSecA">orderDurationSecA</th>
            <th data-field="orderDurationSecB">orderDurationSecB</th>
            <th data-field="sigQuality">sigQuality</th>
            <th data-field="errorInfo">errorInfo</th>

            <th data-field="batteryLevel">batteryLevel</th>
            <th data-field="batteryTemperature">batteryTemperature</th>
            <th data-field="batteryStatus">batteryStatus</th>
            <th data-field="batteryCycleTime">batteryCycleTime</th>
            <th data-field="batteryVoltage">batteryVoltage</th>
            <th data-field="location">location</th>
            <th data-field="isGpsFix">isGpsFix</th>
            <th data-field="mVersion">mVersion</th>
            <th data-field="fVersion">fVersion</th>
            <th data-field="miscMessage">miscMessage</th>
            <th data-field="userIdA">userIdA</th>
            <th data-field="userIdB">userIdB</th>
            <th data-field="orderIdA">orderIdA</th>
            <th data-field="orderIdB">orderIdB</th>


            <th data-field="statusA">statusA</th>
            <th data-field="statusB">statusB</th>
            <th data-field="chargeIn">chargeIn</th>

        </tr>
        </thead>

    </table>
</section>

<script>
    $(document).ready(function () {
        setInterval("search()", 30000);
    });

    function search() {
        $('#online_check_table').bootstrapTable('refresh', {
            query: queryParams({
                pageNumber: 1
            })
        });
    }

    function addHref() {
        $("#online_check_table tr").find("td:eq(1)").each(function () {
            var text = $(this).text();
            $(this).html("<a href=\"\\single\\" + text + "\">" + text + "</a>");
        });
    }

    function queryParams(param) {
        var data = {
            pageSize: $(".page-size").text(),
            deviceId: $("#deviceId_search").val(),
            onlineStatus: $("#online_status_search").val(),
            statusA: $("#channalA_status_search").val(),
            statusB: $("#channalB_status_search").val(),
            mVersion: $("#m_version_search").val(),
            startTime: $('#dateStart').val(),
            endTime: $('#dateEnd').val(),
        };
        if (!data.pageSize) {
            data.pageSize = 50;
        }
        $.extend(param, data);

        setTimeout(function () {
            addHref();
        }, 1000);
        return param;
    }
</script>


<script>
    function update() {
        var list = new Array();
        var cnt = 0;
        var str = "{";
        var select = $("#online_status_search").find("option:selected").text();

        if (select != "online") {
            alert("please select online device!")
            return;
        }

        $("#online_check_table input:checked").each(function () {
            list[cnt++] = $(this).parent().next("td").text();
        });

        cnt = 0;
        for (var i = 0; i < list.length; i++) {
            if (list[i] == "") {

            } else {
                str += "\"list" + cnt++ + "\": " + list[i] + ",";
            }
        }

        str += ("\"cnt\": " + cnt + "}");
        if (confirm(str)) {
            sendUpList(str);
        } else {

        }
    }

    function sendUpList(str) {
        $.ajax({
            type: 'POST',
            url: "/report/uplist.inner",
            contentType: 'application/json',
            dataType: "json",
            data: str,
            timeout: 30000,
            success: function (data) {
                var dataObj = eval(data);
                alert(JSON.stringify(dataObj));
            }
        });
    }
</script>
</body>
</html>
